<template>
  <div id="user">
    <div class="left">
      <div class="time">
        <p>时间参数</p>
        <div class="time_fanwei">
          <span class="time_text">时间范围</span>
          <span class="time_div"></span>
        </div>
        <div class="time_buchang">
          <span>时间步长</span>
          <span class="time_div1"></span>
        </div>
      </div>

      <div class="space">
        <p>&nbsp;&nbsp;空间参数</p>
        <div class="time_fanwei">
          <span class="time_text">经纬度</span>
          <span class="time_div"></span>
        </div>
        <div class="time_buchang">
          <span>高 &nbsp;度 </span>
          <span class="time_div1"></span>
        </div>
      </div>

      <div class="evation">
        <p>&nbsp;&nbsp;空间环境参数</p>
        <div class="time_fanwei">
          <span class="time_text">地磁指数</span>
          <span class="time_div"></span>
        </div>
        <div class="time_buchang">
          <span class="evation_sun">太阳活动指数</span>
          <span class="time_div1"></span>
        </div>
      </div>
    </div>

    <div class="right">
      <div class="ass">
        <p>&nbsp;&nbsp;评估参数</p>
        <div class="time_fanwei">
          <span class="time_text">时间范围</span>
          <span class="time_div"></span>
          <div class="time_fanwei">
            <span class="time_text">地磁指数</span>
            <span class="time_div1"></span>
          </div>
        </div>
      </div>

      <div class="but">
          <el-button type="success" round  @click="run">运 行</el-button>
            <el-button type="warning" round @click="anther">编 辑</el-button>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: "reviews",
  data() {
    return {};
  },
  methods: {
    anther() {
      this.$store.commit("show");
      this.$store.commit("hide2");
    },
    run() {
      this.$router.push({
        path: "/Mymodel",
      });
    },
  },
};
</script>

<style lang="scss" scoped>
#user {
  width: 100%;
  .left {
    width: 45%;
    float: left;
    margin-left: 60px;
    border-right: 1px solid gainsboro;
    p {
      width: 300px;
      height: 50px;
      background: url("@/assets/image/title_4.png") no-repeat;
      color: white;
      font-size: 18px;
    }
    .time_fanwei,
    .time_buchang {
      margin-top: 20px;
      font-size: 18px;
      margin-left: 50px;
    }
    .time_div {
      display: inline-block;
      width: 500px;
      height: 30px;
      border: 1px solid gainsboro;
      margin-left: 50px;
      margin-bottom: -10px;
    }
    .time_div1 {
      display: inline-block;
      width: 100px;
      height: 30px;
      border: 1px solid gainsboro;
      margin-left: 50px;
      margin-bottom: -10px;
    }
    .space {
      margin-top: 100px;
    }
    .evation {
      margin-top: 100px;
      .evation_sun {
        margin-left: -38px;
      }
    }
  }
  .right {
    float: left;
    width: 45%;
    margin-left: 25px;
    .ass {
      p {
        width: 300px;
        height: 50px;
        background: url("@/assets/image/title_4.png") no-repeat;
        color: white;
        font-size: 18px;
      }
      .time_fanwei {
        margin-top: 20px;
        font-size: 18px;
        // margin-left: 50px;
      }
      .time_div {
        display: inline-block;
        width: 500px;
        height: 30px;
        border: 1px solid gainsboro;
        margin-left: 50px;
        margin-bottom: -10px;
      }
      .time_div1 {
        display: inline-block;
        width: 100px;
        height: 30px;
        border: 1px solid gainsboro;
        margin-left: 50px;
        margin-bottom: -10px;
      }
    }
  }
  .but {
    width: 100%;
    height: 90px;
    background: url("@/assets/image/back.png");
    margin-top: 400px;
    text-align: center;
    line-height: 90px;
  }
}
</style>